<template>
    <div class="bg-white main text-center">
        <div class="font-20 weight-bold mt-50">请进行人脸实名认证</div>
        <div class="font-12 color-999 mt-10">为了保证操作安全，需要通过扫脸进行身份认证</div>
        <div class="mt-50">
            <el-image fit="fill" src="https://qiniu.hnmzkj.top/face/face.png" style="width: 50vw; height: 50vw;border-radius: 50%;"></el-image>
        </div>
        <div class="pd-50 flex align-center jus-around font-12">
            <div>
                <el-image fit="fill" src="https://qiniu.hnmzkj.top/face/user.png" style="width: 40px; height: 40px;border-radius: 40px;"></el-image>
                <div>正对屏幕</div>
            </div>
            <div>
                <el-image fit="fill" src="https://qiniu.hnmzkj.top/face/what.png" style="width: 40px; height: 40px;border-radius: 40px;"></el-image>
                <div>脸无遮挡</div>
            </div>
            <div>
                <el-image fit="fill" src="https://qiniu.hnmzkj.top/face/light.png" style="width: 40px; height: 40px;border-radius: 40px;"></el-image>
                <div>光纤充足</div>
            </div>
        </div>
        <div>
            <el-checkbox v-model="checked"></el-checkbox>
            <span class="ml-5 cursor-pointer">
                同意
                <span @click="poprule" class="color-blue">《认证服务协议》</span>
            </span>
        </div>
        <div class="mt-50 pl-30 pr-30">
            <el-button :loading="loading" @click="submit" style="width:100%" type="primary">开始认证</el-button>
        </div>
        <!-- <el-dialog title="《认证服务协议》" :visible.sync="rule_visible">
			认证协议啊
        </el-dialog>-->
        <el-drawer :before-close="handleClose" :modal="false" :visible.sync="rule_visible" direction="btt" size="55%" title="认证服务协议">
            <div class="pl-5 pr-5" style="text-align: left; ">
                <div class="pb-40">
                    <p>本《昊文网络实名认证协议》（以下简称“协议”）是由您（以下简称“用户”或“甲方”）与昊文网络（以下简称“昊文网络”或“乙方”）之间的法律协议。在使用昊文网络的实名认证服务之前，请仔细阅读并理解本协议的所有条款，包括但不限于免除或限制昊文网络责任的免责条款及对用户的权利限制。如您不同意本协议任何条款，请立即停止使用昊文网络的实名认证服务。</p>
                    <strong>1. 服务内容</strong>

                    <p>1.1 实名认证服务：昊文网络为用户提供实名认证服务，以确保用户提供的身份信息的真实性和准确性。实名认证服务的具体内容以昊文网络平台上的实际操作为准。</p>

                    <strong>2. 用户权利和义务</strong>
                    <p>2.1 用户承诺：用户应提供真实、准确、完整的身份信息，并及时更新变更后的信息，确保信息的准确性和时效性。如果用户提供的信息不真实、不准确或不完整，昊文网络有权拒绝提供实名认证服务，并保留追究用户责任的权利。</p>2.2 用户隐私保护：昊文网络将按照相关法律法规及隐私政策保护用户的个人信息，并不会将用户的个人信息用于非法用途。
                    <p>2.3 用户合法权益：用户享有合法使用昊文网络提供的实名认证服务的权利，但不得用于违法活动，包括但不限于冒充他人进行实名认证、虚假认证等行为。</p>
                    <strong>3. 昊文网络的权利和义务</strong>
                    <p>3.1 实名认证审核：昊文网络有权审核用户提交的身份信息，对信息真实性进行核实，但不对用户提供的信息的真实性和准确性承担法律责任。</p>
                    <p>3.2 拒绝服务：如果昊文网络发现用户提供的身份信息不真实、不准确或不完整，昊文网络有权拒绝提供实名认证服务，并保留追究用户责任的权利。</p>
                    <p>3.3 信息保护：昊文网络将按照相关法律法规及隐私政策保护用户的个人信息，不会泄露用户的身份信息给任何第三方，除非经用户明确同意或法律法规规定。</p>
                    <strong>4. 免责声明</strong>
                    <p>4.1 用户明确理解并同意，实名认证服务仅用于提高用户的身份信息真实性和准确性，不代表昊文网络对用户进行其他方面的背景调查或担保其行为的合法性和真实性。</p>
                    <p>4.2 用户在使用实名认证服务时应自行承担风险，如因用户提供的身份信息不真实、不准确或不完整而导致的一切法律后果和责任，均由用户自行承担。</p>
                    <strong>5. 协议的解除</strong>
                    <p>5.1 用户有权随时终止使用昊文网络的实名认证服务，用户的终止行为将导致用户不能继续使用昊文网络的相关服务。</p>
                    <p>5.2 昊文网络有权终止向用户提供实名认证服务，如用户违反本协议的任何条款或法律法规的规定。</p>
                    <strong>6. 其他条款</strong>
                    <p>6.1 本协议的签署、生效、履行、解释及争议解决均适用中华人民共和国的法律法规。</p>
                    <p>6.2 本协议的任何条款如有违反法律法规的规定或被认定为无效的，不影响其他条款的有效性。</p>
                    <p>6.3 本协议的解释权归昊文网络所有。</p>
                    <strong>我已经详细阅读并同意以上协议内容，并愿意遵守昊文网络的相关规定。</strong>
                </div>
                <div></div>
            </div>
        </el-drawer>
    </div>
</template>

<script>
import { Base64 } from 'js-base64'
export default {
    data() {
        return {
            image: 'https://qiniu.hnmzkj.top/10024_IOS_20230305165403_commodity_title_image0_cover.png',
            checked: false,
            rule_visible: false,
            form: {},
            loading: false,
        }
    },
    methods: {
        poprule() {
            this.rule_visible = true
        },
        handleClose() {
            this.rule_visible = false
        },
        submit() {
            if (this.checked != true) {
                this.$message.error('请先阅读并同意《认证服务协议》')
                return false
            }
            this.loading = true
            this.apis.authentication(this.form).then((res) => {
                this.loading = false
                if (!res.hasOwnProperty('certifyUrl')) {
                    this.$message.error('为获取到实名认证链接')
                }
                console.log(res)
                // window.location.href = res.certifyUrl;
            })
        },
    },
    mounted() {
        this.form = this.$route.query
        this.form.meta_info = Base64.encode(JSON.stringify(window.getMetaInfo()))
    },
}
</script>

<style scoped>
.main {
    position: fixed;
    height: 100vh;
    width: 100vw;
}
.bg-white {
    background: #fff;
}
.font-20 {
    font-size: 20px;
}
.weight-bold {
    font-weight: bold;
}
/deep/.el-drawer__header {
    padding: 5px !important;
    padding-top: 10px;
    margin-bottom: 5px !important;
}
</style>